<template>
    <div class="newAsking">
        <p class="newAsking-title">新增问题</p>
        <div class="form">
            <div class="choose">
                <span class="choose-text">
                    选择分类
                </span>
                <el-select v-model="value" placeholder="请选择" >
                    <el-option
                    v-for="item in options"
                    :key="item.value"
                    :label="item.label"
                    :value="item.value">
                    </el-option>
                </el-select>
               
            </div>
            <div class="question-title">
                <span class="title-text">
                    标题:
                </span>
                <input type="text" class="input-title"/>
            </div>
            <div class="question-textarea">
                <span class="textarea-text">内容:</span>
                <textarea class="textarea"></textarea>
                
            </div>
        </div>
        <p class="btn-wrap">
            <button class="btn">提交</button>
            <button class="btn">取消</button>
        </p>

        
    </div>
</template>
<script>
export default {
    data(){
        return {
            options:[
                {
                    value:'sda',
                    label:'摄影部'                    
                },
                {
                    value:'sda2',
                    label:'技术部'                    
                },
            ],
            value:'',
        }
    }
}
</script>
<style lang="scss" scoped>
$borderColor:#b6b6b6;
.newAsking{
    height: 800px;
    .newAsking-title{
        height: 44px;
        line-height: 44px;
        font-size:18px;
        border-bottom: 1px solid #6f6f6f;
        color:#000;
        .el-input__inner{
            border: 1px solid $borderColor;
        }
        

    }
    .form{
        .choose{
            margin-top: 24px;
            margin-bottom: 36px;
            .choose-text{
                
                margin-right: 22px;
            }

        }
        .question-title{
            margin-bottom: 46px;
            .title-text{
                font-size: 16px;
                margin-right: 50px;

            }
            .input-title{
                width: 780px;
                height: 20px;
                border:1px solid $borderColor;
            }

        }
        .question-textarea{
            margin-bottom: 50px;
            .textarea-text{
                font-size: 16px;
                margin-right: 50px;
                vertical-align: top;

            }           
            .textarea{
                width: 780px;
                height: 400px;
                vertical-align: top;
                border:1px solid $borderColor;

            }
            

        }
        
    
    }
    .btn-wrap{
        text-align: center;
        .btn{
            padding: 5px 12px;
            font-size: 16px;
            color: #fff;
            background-color: #2bdffb;
            border-radius: 6px;
            cursor: pointer;
            &:hover{
                background-color: #249caf;
                text-decoration: underline;
            }
        }
    
    }
   

}

</style>

